<!DOCTYPE html>
<html lang="en">
<head>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" > </script>
    <meta charset="UTF-8">
    <title>zabbix screens</title>
</head>
<style>
    .info {
        margin-top: 20px;
        width: 260px;
        height: 50px;
        background-color: bisque;
        padding: 10px;
    }
</style>
<body>

        {% csrf_token %}

        zabbix 用户名: <input id="username" type="text" name="username" /></br>
        <p></p>
        zabbix 密码: <input id="passwd" type="password" name="password" /></br>
        <p></p>
        customer group name: <input id="group_name" type="text" name="cu"/></br>
        <p></p>
        <input id="add" type="button" value="创建screen" name="add"/>&nbsp;&nbsp;
        <input id="del" type="button" value="删除screen" name="del"/>


        <div class="info" id="info"></div>


<script>


/*
    document.getElementsByTagName('form')[0].onsubmit = function () {
        var user_name = document.getElementsByName('username')[0].value;
        var passwd = document.getElementsByName('password')[0].value;
        var group_name = document.getElementsByName('cu')[0].value;

        if ( ! patt.test(user_name)) {
            alert('请输入你正确的zabbix用户');
            return false;
        }
        console.log(passwd);
        if ( passwd == null ) {
            alert('你忘记输入密码了哦^_^');
            return false;
        }
        patt = /^\w+$/;
        if ( ! patt.test(group_name) ) {
            alert('zabbix group name 不合法!');
            return false;
        }
    }
    */


    // using jQuery
    function getCookie(name) {
        var cookieValue = null;
        if (document.cookie && document.cookie !== '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
                // Does this cookie string begin with the name we want?
                if (cookie.substring(0, name.length + 1) === (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
    var csrftoken = getCookie('csrftoken');

    function csrfSafeMethod(method) {
        // these HTTP methods do not require CSRF protection
        return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
    }

    $.ajaxSetup({
        beforeSend: function(xhr, settings) {
            if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                xhr.setRequestHeader("X-CSRFToken", csrftoken);
            }
        }
    })



    $(document).ready(

            /*var csrftoken = $.cookie('csrftoken');
            console.log(csrftoken);*/

            $("#add").click(
                    function() {
                        var user_name = $("#username").val();
                        var passwd = $("#passwd").val();
                        var group_name = $("#group_name").val();

                        var patt = /^\w+\.\w+$/;
                        if (!patt.test(user_name)) {
                            alert('请输入你正确的zabbix用户');
                            return false
                        }

                        if (passwd == null) {
                            alert('你忘记输入密码了哦^_^');
                        }
                        patt = /^\w+$/;
                        if (!patt.test(group_name)) {
                            alert('zabbix group name 不合法!');
                            return false
                        }


                        $.post("/add/",
                                {
                                    username: user_name,
                                    password: passwd,
                                    cu: group_name
                                },
                                function (data, status) {
                                    if (status == "success") {
                                        (data == 0) ? $("#info").text(group_name + " screens already exists!") : $("#info").text(group_name + " screens created successfully.");
                                    } else {
                                        $("#info").text(" 发生未知错误!");
                                    }
                                });
                    }
            ),

            $("#del").click(
                    function() {
                        var user_name = $("#username").val();
                        var passwd = $("#passwd").val();
                        var group_name = $("#group_name").val();

                        var patt = /^\w+\.\w+$/;
                        if (!patt.test(user_name)) {
                            alert('请输入你正确的zabbix用户');
                            return false
                        }

                        if (passwd == null) {
                            alert('你忘记输入密码了哦^_^');
                        }
                        patt = /^\w+$/;
                        if (!patt.test(group_name)) {
                            alert('zabbix group name 不合法!');
                            return false
                        }


                        $.post("/del/",
                                {
                                    username: user_name,
                                    password: passwd,
                                    cu: group_name
                                },
                                function (data, status) {
                                    if (status == "success") {
                                        if (data == 1) {
                                            $("#info").text(group_name + " not exists!");
                                        }
                                        if (data == 0) {
                                            $("#info").text(group_name + " screens deleted successfully !");
                                        }
                                        else {
                                            $("#info").text("delete " + group_name + " error: \n" + data);
                                        }
                                    } else {
                                        $("#info").text(" 发生未知错误!");
                                    }
                                });
                    }
            )
    )
</script>
</body>
</html>